<template>
	<view class="content">
		<view class="header" :style="{'margin-top':tops+'px'}">
			<image class="back" @click="goBack" src="../../static/9.png"></image>
			<view class="name">历史记录</view>
			<view class="history">复制下载链接</view>
		</view>
		
		<view class="lists">
			<view class="li">
				<view>属性：客户姓名</view>
				<view>修改前：李五</view>
				<view>修改后：张三</view>
				<view class="time">修改时间：2024年8月6日 12时50分</view>
			</view>
			<view class="li">
				<view>属性：客户姓名</view>
				<view>修改前：李五</view>
				<view>修改后：张三</view>
				<view class="time">修改时间：2024年8月6日 12时50分</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				tabList: [{
						text: '客户资料历史'
					},
					{
						text: '附件历史记录'
					}
				],
				tabActive: 0,
				array: [{
						name: '男',
						value: 0
					},
					{
						name: '女',
						value: 1
					}
				],
				sexIndex: -1,
				tops:0,
				height:0
			}
		},
		onLoad() {
			
			uni.getSystemInfo({

				success: (e) => {

				  this.tops = e.statusBarHeight;

				  let custom = uni.getMenuButtonBoundingClientRect();

				  this.height = custom.height + (custom.top - e.statusBarHeight) * 2;

				}

			  })

		},
		methods: {
			goBack(){
				uni.navigateBack()
			},
			tabChange(index) {
				this.tabActive = index
			},

			getMapLocation() {
				let that = this
				uni.chooseLocation({
					success: (res) => {
						// 将获取到的地址信息存储
						this.address = res.address
						console.log(666, res)
					},
					fail: () => {
						// 如果用uni.chooseLocation没有获取到地理位置，则需要获取当前的授权信息，判断是否有地理授权信息
						uni.getSetting({
							success: (res) => {
								var status = res.authSetting;
								if (!status['scope.userLocation']) {
									// 如果授权信息中没有地理位置的授权，则需要弹窗提示用户需要授权地理信息
									uni.showModal({
										title: "是否授权当前位置",
										content: "需要获取您的地理位置，请确认授权，否则地图功能将无法使用",
										success: (tip) => {
											if (tip.confirm) {
												// 如果用户同意授权地理信息，则打开授权设置页面，判断用户的操作
												uni.openSetting({
													success: (data) => {
														// 如果用户授权了地理信息在，则提示授权成功
														if (data
															.authSetting[
																'scope.userLocation'
																] === true
															) {
															uni.showToast({
																title: "授权成功",
																icon: "success",
																duration: 1000
															})
															// 授权成功后，然后再次chooseLocation获取信息
															uni.chooseLocation({
																success: (
																	res
																	) => {
																	// 将获取到的地址信息存储
																	this.address =
																		res
																		.address
																}
															})
														} else {
															uni.showToast({
																title: "授权失败",
																icon: "none",
																duration: 1000
															})
														}
													}
												})
											}
										}
									})
								}
							},
							fail: (res) => {
								uni.showToast({
									title: "调用授权窗口失败",
									icon: "none",
									duration: 1000
								})
							}
						})
					}
				});
			},

		}
	}
</script>

<style>
	.header{
		width: 100%;
		height: 100rpx;
		line-height: 90rpx;
		position: fixed;
		top: 0;
		text-align: center;
		background-color: white;
	}
	.header .back{
		width: 20rpx;
		height: 40rpx;
	    margin-left: 30rpx;
		margin-top: 30rpx;
		float: left;
	}
	.header .name{
		height: 100%;
		line-height: 90rpx;
		margin-top:7rpx;
	}
	.header .history{
		width: 170rpx;
		height: 60rpx;
		line-height: 60rpx;
		border-radius: 5rpx;
		text-align: center;
		position: absolute;
		right: 50rpx;
		top: 26rpx;
		background-color: #008BDE;
		color: #fff;
		font-size: 26rpx;
	}
	/*#ifdef MP-WEIXIN*/
	   .header .name{
	   	width: 35%;
	   	line-height: 90rpx;
		margin-right: 50rpx;
		float: left;
	   }
	   .header .history{
		    float: left;
			position: initial;
			margin-top: 20rpx;
	   }
	/*#endif*/
	.tabList {
		width: 90%;
		height: 80rpx;
		line-height: 80rpx;
		border: 1rpx solid #008BDE;
		margin: auto;
		margin-top: 130rpx;
		/*#ifdef MP-WEIXIN*/
		margin-top: 200rpx;
		/*#endif*/
		display: flex;
	}

	.tabList .li {
		width: 50%;
		text-align: center;
		color: #008BDE;
	}

	.tabActive {
		background-color: #008BDE;
		color: white !important;
	}

	.formCon {
		width: 90%;
		margin: auto;
		margin-top: 50rpx;
	}
    .lists{
		width: 90%;
		margin: auto;
		margin-top: 100rpx;
		/*#ifdef MP-WEIXIN*/
		margin-top: 200rpx;
		/*#endif*/
	}
	.lists .li{
		line-height: 60rpx;
		margin-top: 30rpx;
		border-bottom: 1rpx solid #f5f5f5;
		padding-bottom: 20rpx;
		font-size: 28rpx;
	}
	.lists .li .time{
		color: #999;
	}
	
	.imgList{
		margin-top: 20rpx;
		display: flex;
	}
	.imgList image{
		width: 100rpx;
		height: 100rpx;
		margin-left: 10rpx;
	}
	
    

</style>